<template>
  <view class="user-info">
    <nav-bar title="应用信息" color="white" show-back bgColor="black"></nav-bar>
    <view class="content">
      <view class="base-info">
        <view class="bus-name flex justify-between">
          <text class="block"> {{ appInfo.appName }}</text>
        </view>

        <text @click="updateVersion">当前版本：{{ appInfo.appVersion }}</text>
      </view>

      <!-- 责任信息 -->
      <view class="respon-info">
        <view class="block" @click="debug"
          ><text>设备型号：{{ appInfo.deviceModel || "-" }}</text></view
        >
        <view class="block" @click="debug"
          ><text>设备序列号：{{ appInfo.CID || "-" }}</text></view
        >

        <u-line margin="0.5em 0" />
        <view class="block"
          ><text>硬件指纹：{{ appInfo.hardwareFingerprint }} </text>
          <text class="ml-5rpx text-blue-400 font-bold" @click="initHardwareFingerprint"> 获取 </text>
        </view>
        <view class="block"
          ><text>设备激活状态：{{ appInfo.isActived ? "已激活" : "未激活" }}</text></view
        >
        <view class="block"
          ><text>SDK状态：{{ appInfo.isSDKInit ? "初始化完成" : "未初始化" }}</text></view
        >
        <view class="block"
          ><text class="text-blue-500" @click="faceDatabaseManagement">本地人脸数据管理 👉</text></view
        >
      </view>
    </view>
  </view>
</template>
<script setup>
import { asyncExecFunction } from "@/king-components/js/KingonPlus";
import { checkUpgrade, getDeviceSerialNumber } from "@/utils/util";
import { computed, onMounted, reactive, ref } from "vue";
import { useStore } from "vuex";
import { getVersion } from "@kingon/app-tools";
const store = useStore();

const appInfo = reactive({
  appName: "",
  appVersion: "",
  CID: "",
  isActived: computed(() => store.state.face.isActivated),
  hardwareFingerprint: computed(() => store.state.face.hardwareFingerprint),
  isSDKInit: computed(() => store.state.face.isSDKInit),
  deviceModel: "",
});

onMounted(async () => {
  uni.getSystemInfo({
    success: (res) => {
      appInfo.appName = res.appName;
      appInfo.deviceModel = res.deviceModel;
    },
  });

  appInfo.appVersion = await getVersion();
  // 获取设备cid
  appInfo.CID = await getDeviceSerialNumber();

  checkUpgrade((data) => {}, true, false);
});

const updateVersion = () => {
  checkUpgrade((data) => {}, true, false);
}

// 打开调试页面
const debugCount = ref(0);
const debug = () => {
  if (!debugCount.value) debugCount.value = 0;
  debugCount.value++;
  if (debugCount.value < 5) return;
  debugCount.value = 0;
  uni.navigateTo({
    url: `/pages/subSetting/debug/debug`,
  });
};

const faceDatabaseManagement = async () => {
  try {
    await asyncExecFunction("baiduFaceDatabaseManagement");
  } catch (error) {
    console.error(error);
    uni.showToast({ title: "无法跳转管理页面", icon: "none" });
  }
};

// 获取硬件指纹
const initHardwareFingerprint = async () => {
  await store.dispatch("face/initHardwareFingerprint");
  appInfo.hardwareFingerprint = store.state.face.hardwareFingerprint;
};
</script>
<style lang="scss" scoped>
.content {
  height: 100%;
  max-width: 50vw;
  margin: 0 auto;
}

.user-info {
  background-color: white;
  height: inherit;
  box-sizing: border-box;
  font-size: 10rpx;

  .base-info {
    margin: 20rpx;
    background-color: #f5faff;
    padding: 20rpx;
    border-radius: 5rpx;
    font-weight: bolder;

    .bus-name {
      font-size: 15rpx;
      margin-bottom: 20rpx;
    }
  }

  .respon-info,
  .server-info {
    margin: 20rpx;
    padding: 20rpx;
    font-size: 10rpx;
    // font-weight: bold;

    .block {
      padding: 5rpx 0rpx;
    }

    .info-text {
      display: block;
      white-space: nowrap;
      overflow: scroll;
    }
  }
}

.btns-item {
  background-color: #efefef;
  padding: 5rpx 20rpx;
  border-radius: 5rpx;
  margin: 0rpx 15rpx;
  font-size: 12rpx;
  &.confirm {
    color: white;
    background-color: red;
  }

  .btns-item-txt {
    font-size: 10rpx;
    padding: 5rpx 15rpx;
  }

  ::v-deep .u-button {
    padding: 2rpx 20rpx;
  }
}
</style>
